<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>


    <input type="text" id="massage" name="massage"><br>
    <input type="button" onclick="send2()" value="发送" id="send"><br>
    <textarea id="responseText" style="width: 1000px;height: 600px"><br>
     </textarea>

</body>
<script type="text/javascript">
    var socket;
    var responseText = document.getElementById("responseText");
    if (!window.WebSocket) {
        window.WebSocket = window.MozWebSocket;
    }
    if (window.WebSocket) {
        socket = new WebSocket("ws://localhost:8888/websocket");
        socket.onmessage = function (ev) {
            responseText.value += ev.data + '\r\n';
        };
        socket.onopen = function (ev) {
            responseText.value = '已建立连接'+'\r\n';
        };
        socket.onclose = function (ev) {
            responseText.value = '断开连接！';
        };
    } else {
        alert("您的浏览器不支持WebSocket");
    }

    function send2() {
        var massage = document.getElementById("massage");
        if (!window.WebSocket) {
            return;
        }
        if (socket.readyState == WebSocket.OPEN) {
            socket.send(massage.value);
        } else {
            alert("连接没有建立成功");
        }
    }
</script>
</html>